<script setup>
  import { reactive, ref } from 'vue'
  // reactive 接收一个对象类型的数据，返回一个响应式的对象
  const state = reactive({count:100})
  const setCount = () => {
    state.count++
  }
  // ref 接收简单类型或者对象类型的数据传入并返回一个响应式的对象
  const num = ref(0)
  const setNum = () => {
    num.value++
  }
</script>

<template>
  <div>{{ state.count }}</div>
  <button @click="setCount">点击修改Count</button>
  <hr>
  <div>{{ num }}</div>
  <button @click="setNum">点击修改Num</button>
</template>

<style scoped>

</style>